<div id="online-check-view">
  <div class="pageheader">
    <!--(合同号：{{contractData.uuid}})-->
    <h2><i class="fa fa-home"></i>线上入住</h2>
    <!--<div class="al-header-right">-->
    <!--<button type="button" class="btn btn-warning" ng-click="backToEntrance()">返回</button>-->
    <!--</div>-->
  </div>
  <div class="page">
    <ng-form class="form-horizontal">
      <div class="form-group" ng-if="!contractData">
        <label class="col-sm-2 col-sm-offset-1 control-label">
          搜索合同
        </label>
        <div class="col-sm-6">
          <div class="input-group">
            <input type="text" class="form-control" placeholder="请输入房间号，合同号或者手机"
                   ng-model="search.filter">
            <span class="input-group-addon" ng-click="searchContract()">
              匹配
            </span>
          </div>
        </div>
      </div>
      <div class="form-group" ng-if="contractData">
        <label class="col-sm-2 col-sm-offset-1 control-label">
          合同号
        </label>
        <div class="col-sm-6">
          <div class="input-group">
            <input type="text" class="form-control" readonly
                   ng-model="contractData.uuid">
            <span class="input-group-addon" ng-click="resetContract()">
              重置
            </span>
          </div>
        </div>
      </div>

      <div class="form-group" ng-show="!contractData && tableData.length>1" style="padding:  20px 0;">
        <div class="col-sm-10 col-sm-offset-1">
          <table ng-table="tableParams"
                 class="table  table-bordered table-striped table-condensed al-table-container">
            <thead>
            <tr>
              <td>合同号</td>
              <td>公寓</td>
              <td>楼栋</td>
              <td>房间号</td>
              <td>租房人姓名</td>
              <td>租房人手机</td>
              <td>操作</td>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="item in $data">
              <td>{{item.uuid}}</td>
              <td>{{item.apartmentName}}</td>
              <td>{{item.buildingName}}</td>
              <td>{{item.houseNo}}</td>
              <td>{{item.customerName}}</td>
              <td>{{item.customerPhone}}</td>
              <td>
              <button class="btn btn-info btn-sm" ng-click="pickContract(item)">选择</button>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>
    </ng-form>
    <ng-form ng-if="contractData" class="form-horizontal">
      <div class="form-group">
        <h4 class="text-center">房间信息</h4>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">公寓</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.apartmentName}}</div>
        </div>
        <label class="control-label col-sm-2">楼栋</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.buildingName}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">合同开始日期</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.leaseStart|dateTransfer:'YYYY-MM-DD'}}</div>
        </div>
        <label class="control-label col-sm-2">合同结束日期</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.leaseEnd|dateTransfer:'YYYY-MM-DD'}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">楼层</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.floor}}</div>
        </div>
        <label class="control-label col-sm-2">房间号</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.houseNo}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">租房方式</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.payWayName}}</div>
        </div>
        <label class="control-label col-sm-2">租期</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.leaseName}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">月租金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.rental}}</div>
        </div>
        <label class="control-label col-sm-2">押金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.deposit}}</div>
        </div>
      </div>
    </ng-form>
    <ng-form ng-if="contractData" class="form-horizontal">
      <div class="form-group">
        <h4 class="text-center">租客信息</h4>
      </div>
      <div class="form-group">
        <div class="col-sm-6">
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">租客名称</label>
            <div class="col-sm-6">
              <div class="form-control info-text">{{contractData.customerName}}</div>
            </div>

          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">租客手机号</label>
            <div class="col-sm-6">
              <div class="form-control info-text">{{contractData.customerPhone}}</div>
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">身份证</label>
            <div class="col-sm-6">
              <div class="form-control info-text">{{contractData.customerCard}}</div>
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">性别</label>
            <div class="col-sm-6">
              <div class="form-control info-text">{{contractData.sex|constantTransfer:sexList}}</div>
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">住客人数</label>
            <div class="col-sm-6">
              <div class="input-group">
                <input type="number" class="form-control" readonly ng-model="contractData.cotenants.length"
                       maxlength="4">
                <span class="input-group-addon" ng-click="openCotenant('view',contractData.cotenants)">查看</span>
              </div>
            </div>
          </div>
        </div>
        <div class="col-sm-6">
          <div class="form-group" style="margin-bottom: 10px;">
            <label class="control-label col-sm-4 ">身份证正面</label>
            <div class="col-sm-6 id-card-container">
              <img ng-src="{{person.idcardFront}}" alt="上传身份证反面"
                   ng-click="uploadIDCFront()">
              <input id="on-idcard-front" style="display: none" type="file">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4">身份证反面</label>
            <div class="col-sm-6 id-card-container">
              <img ng-src="{{person.idcardBack}}" alt="上传身份证反面"
                   ng-click="uploadIDCBack()">
              <input id="on-idcard-back" style="display: none" type="file">
            </div>
          </div>
        </div>
      </div>
    </ng-form>
    <ng-form name="checkInForm" ng-if="contractData" class="form-horizontal">
      <div class="form-group">
        <h4 class="text-center">付款信息</h4>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">租金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.rental}}</div>
        </div>
        <label class="control-label col-sm-2">押金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractData.deposit}}</div>
        </div>
      </div>
      <div class="form-group">
        <!--<label class="control-label col-sm-2 col-sm-offset-1">付款方式</label>-->
        <!--<div class="col-sm-3">-->
          <!--<div class="form-control info-text">{{contractData.payTypeName}}</div>-->
        <!--</div>-->
        <label class="control-label col-sm-2 col-sm-offset-1">付款状态</label>
        <div class="col-sm-3">
          <div class="form-control info-text">已付款</div>
        </div>
      </div>
      <!--<div class="form-group">-->
        <!--<label class="control-label col-sm-2 col-sm-offset-1">费用明细</label>-->
        <!--<div class="col-sm-9">-->
          <!--<textarea cols="4" class="form-control" readonly-->
                    <!--ng-model="pay.billContent"></textarea>-->
        <!--</div>-->
      <!--</div>-->
      <div class="form-group">
        <h4 class="text-center">入住信息</h4>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">业务员<span class="attr-need">*</span></label>
        <div class="col-sm-3">
          <input class="form-control" name="receptionist" ng-readonly="contractData.status==8"
                 type="text" required ng-model="checkIn.receptionist">
        </div>
        <label class="control-label col-sm-2">渠道</label>
        <div class="col-sm-3">
          <select ng-model="checkIn.buzType" class="form-control" ng-disabled="contractData.status==8"
                  ng-options="option.value as option.name for option in channelTypeList"></select>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">邀请码</label>
        <div class="col-sm-3">
          <input class="form-control" name="receptionist" ng-readonly="contractData.status==8"
                 type="text" ng-model="checkIn.inviteCode">
        </div>
      </div>
      <div class="form-group" ng-if="contractData.status==4 || contractData.status==8">
        <label class="control-label col-sm-2 col-sm-offset-1">备注</label>
        <div class="col-sm-8">
          <textarea class="form-control" ng-readonly="contractData.status==8"
                    placeholder="填写备注信息"
                    ng-model="checkIn.contractPicture"></textarea>
        </div>
      </div>
      <div class="form-group">
        <div class="col-sm-2"></div>
        <div class="col-sm-2">
          <button class="btn btn-info" ng-if="contractData.status==4" ng-click="editContract()">合同编辑</button>
        </div>
        <div class="col-sm-2">
          <button class="btn btn-primary" ng-disabled="checkInForm.$invalid || contractData.checked"
                  ng-if="contractData.status==4"
                  ng-click="onlineCheckIn()">快捷入住
          </button>
        </div>
        <div class="col-sm-2">
          <button class="btn btn-warning" ng-click="printContract()">合同打印</button>
        </div>

      </div>
    </ng-form>
  </div>
</div>